1,208
Expand|Select|Wrap|Line Numbers
- <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
- <html xmlns="http://www.w3.org/1999/xhtml">
- <head>
- <meta http-equiv="Content-Language" content="en-us" />
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
- <title>DivCenter Experiment</title>
- </head>
- <style>
- body, html
- {
- width: 100%;
- height: 100%;
- margin: 0px;
- padding: 0px;
- background-color: #FFFFFF;
- }
- .favBgStyle
- {
- border: 0px;
- padding: 0px;
- margin: 0px;
- width: 100%;
- position: absolute;
- background-color: #000000;
- opacity: 0.5;
- filter: Alpha(opacity:50);
- z-index: 0;
- }
- .favAreaBg
- {
- border: 0px;
- padding: 0px;
- position: absolute;
- background-color: #FFFFFF;
- z-index: 1;
- }
- .occupySpace
- {
- height: 1500px;
- }
- </style>
- <script>
- function OffWindowH()
- {
- var OffWindowH=0;
- window.scrollTo(0,10000000);
- if(typeof self.pageYOffset!='undefined')
- OffWindowH=self.pageYOffset;
- else if(document.compatMode && document.compatMode != 'BackCompat')
- OffWindowH=document.documentElement.scrollTop;
- else if(document.body && typeof(document.body.scrollTop)!='undefined')
- OffWindowH=document.body.scrollTop;
- window.scrollTo(0,0);
- return OffWindowH;
- }
- function WindowHeight()
- {
- var WindowHeight = 0;
- if( typeof( window.innerWidth ) == 'number' )
- WindowHeight = window.innerHeight;
- else if (document.documentElement && document.documentElement.clientHeight)
- WindowHeight = document.documentElement.clientHeight;
- else if(document.body && document.body.clientHeight)
- WindowHeight = document.body.clientHeight;
- return WindowHeight;
- }
- function pHeight()
- {
- var pHeight = OffWindowH() + WindowHeight();
- return pHeight;
- }
- function favBg()
- {
- var favBg = document.getElementById('favBg');
- favBg.style.height = pHeight() + 'px';
- }
- var cdiv = "blank";
- function favArea() {
- if (cdiv == "blank") { cdiv = window.setInterval("favArea()", 50); }
- var Element = document.getElementById("favArea");
- objh = parseFloat(Element.style.height)/2;
- objw = parseFloat(Element.style.width)/2;
- Element.style.top = Math.floor(Math.round((document.documentElement.offsetHeight/2)+document.documentElement.scrollTop)-objh)+'px';
- Element.style.left = Math.floor(Math.round((document.documentElement.offsetWidth/2)+document.documentElement.scrollLeft)-objw)+'px';
- }
- </script>
- <body onload="favBg(); favArea();">
- <div id="favArea" class="favAreaBg" style="width: 500px; height: 400px;"><table width="100%" height="100%"><tr><td valign="middle" align="center">This is dead center</td></tr></table></div>
- <div id="favBg" class="favBgStyle"></div>
- <div class="occupySpace"></div>
- </body>
- </html>
This is another example written by me that will put a div dead center of the window.
